$primary: #409EFF;
$success: #67C23A;
$warning: #E6A23C;
$danger: #F56C6C;
$info: #909399;

$primary-hover: #66b1ff;
$success-hover: #85ce61;
$warning-hover: #ebb563;
$danger-hover: #f78989;
$info-hover: #a6a9ad;

$primary-active: #3a8ee6;
$success-active: #5daf34;
$warning-active: #cf9236;
$danger-active: #dd6161;
$info-active: #82848a;
$font-size:12px;
$border-radius:4px;
$--sm: 768px !default;
$--md: 992px !default;
$--lg: 1200px !default;
$--xl: 1920px !default;

$map: (
  'xs' : (max-width: $--sm - 1),/*最大767*/
  'sm' : (min-width: $--sm),/*最小768*/
  'md' : (min-width: $--md),/*最小992*/
  'lg' : (min-width: $--lg),/*最小1200*/
  'xl' : (min-width: $--xl)/*最小1920*/
);
//定义一个方法，
@mixin res($key){
  //仅在哪个屏下，map-get去映射表里取值，从$map这个表里取key，用inspect解析
  @media only screen and #{inspect(map-get($map,$key))} {
    @content;//插槽，把传入的东西放进来
  }
}

*{
    padding:0;
    margin:0;
    box-sizing:border-box;
}